<template>
  <div class="goods">
    <p>{{ uname }}</p>
    <p>{{ age }}</p>
    <p>{{ gender }}</p>
  </div>
</template>

<script>
export default {
  //接收父组件传递过来的数据
  //接收到的数据,和data数据一样用,只是不能修改
  // props: ["uname", "age", "gender"],

  //props也可以写成对象格式(为了加更多配置)
  //有三个配置可以使用,required表示必填 type类型约束 default默认值
  props: {
    uname: {
      required: true, //表示父组件必须给我传递uname
      type: String, //要求父组件传递过来的uname必须是字符串类型
    },
    age: Number, //表示父组件传递过来的值必须是Number类型
    gender: {
      default: "未知",
      type: [String, Number], //如果允许多种类型,则写成数组格式
    },
  },
};
</script>

<style>
.goods {
  padding: 10px;
  margin: 8px;
  border: 3px solid #000;
  min-height: 50px;
  width: 300px;
}
</style>